<template>
  <div class="dashboard-container">
    <el-descriptions  title="CPU信息：" :column="1" size="small" border style="width: 30%">
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-cpu"></i>
          CPU型号
        </template>
        {{ sys.cpu.name }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-cpu"></i>
          核心数
        </template>
        {{ sys.cpu.physicalCount }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-cpu"></i>
          线程数
        </template>
        {{ sys.cpu.logicalCount }}
      </el-descriptions-item>
    </el-descriptions>

    <br>
    <el-descriptions  title="系统信息：" :column="1" size="small" border style="width: 30%">
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-set-up"></i>
          系统概述
        </template>
        {{ sys.basic.sysArch }}
      </el-descriptions-item>
      <el-descriptions-item >
        <template slot="label">
          <i class="el-icon-set-up"></i>
          ip地址
        </template>
        {{ sys.basic.sysIp }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-set-up"></i>
          系统名称
        </template>
        {{ sys.basic.sysName }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-set-up"></i>
          系统版本
        </template>
        {{ sys.basic.sysVersion }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-set-up"></i>
          用户目录
        </template>
        {{ sys.basic.userDir }}
      </el-descriptions-item>
    </el-descriptions>

    <br>
    <el-descriptions  title="Jvm信息：" :column="1" size="small" border style="width: 30%">
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-money"></i>
          空闲内存
        </template>
        {{ sys.jvm.freeMemory }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-money"></i>
          总内存
        </template>
        {{ sys.jvm.totalMemory }}
      </el-descriptions-item>
      <el-descriptions-item >
        <template slot="label">
          <i class="el-icon-c-scale-to-original"></i>
          Jdk版本
        </template>
        {{ sys.jvm.version }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-folder"></i>
          Jdk目录
        </template>
        {{ sys.jvm.home }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-video-pause"></i>
          运行时长
        </template>
        {{ sys.jvm.runTime }}
      </el-descriptions-item>
      <el-descriptions-item >
        <template slot="label">
          <i class="el-icon-money"></i>
          运行时内存
        </template>
        {{ sys.jvm.runTimeMemory }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-s-platform"></i>
          运行时间
        </template>
        {{ sys.jvm.startTime }}
      </el-descriptions-item>
    </el-descriptions>

    <br>
    <el-descriptions  title="内存使用情况：" :column="2" size="small" border style="width: 30%">
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-money"></i>
          空闲内存
        </template>
        {{ sys.memory.available }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-money"></i>
          虚拟总内存
        </template>
        {{ sys.memory.swapTotal }}
      </el-descriptions-item>
      <el-descriptions-item >
        <template slot="label">
          <i class="el-icon-money"></i>
          已使用虚拟内存
        </template>
        {{ sys.memory.swapUsed }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-money"></i>
          物理总内存
        </template>
        {{ sys.memory.total }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label" style="width: 150px">
          <i class="el-icon-money"></i>
          已使用物理内存
        </template>
        {{ sys.memory.used }}
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>

<script>
export default {
  name: 'index',
  created(){
    this.getSysInfo();
  },
  computed: {
  },
  data() {
    return {
      sys:{
        cpu:{},
        basic:{},
        jvm:{},
        memory:{},
        hardwareList:{}
      }
    };
  },
  methods: {
    getSysInfo(){
      this.$http.get(this.$constant.baseURL + "/system/get-server-info", {},true)
        .then(res => {
          this.sys = res.data
        })
    }
  }
}
</script>
<style>
  .el-descriptions-item__label.is-bordered-label {
    width: 150px;
  }
</style>
